<template>
  <div class="home">
    <div class="home2">
      {{dateTwo.name}}
      <svgIcon title="delete"></svgIcon>

      <van-cell-group inset>
        <van-field v-model="value" label="文本" placeholder="请输入用户名" />
      </van-cell-group>
      <van-button type="primary" @click="logout">退出登录</van-button>
    </div>
  </div>
</template>
<script lang="ts" setup>
import {h, onMounted, reactive, defineAsyncComponent, ref} from 'vue'
import {loadingComponent,errorComponent} from "../components/SvgIcon/wait";
import fetchApi from '../api/user/index'
import {removeToken} from "../utils/auth";
import {usePerMissIoStoreWithOut} from "../store/modules/permission";
import {router} from "../router";
const perMissIoStore = usePerMissIoStoreWithOut();
import useToast from "../hooks/useToast";

let myToast = useToast()

const svgIcon = defineAsyncComponent({
  loader:()=> import("@/components/SvgIcon"),
  delay:1000,
  timeout:3000,
  errorComponent:errorComponent,
  loadingComponent:loadingComponent
});


let dateTwo = reactive({name: 'zs'})

const value = ref('')

onMounted(() => {
  dateTwo.name = 'lsz'
  myToast(123)
})

const logout = async ()=>{
   const data = await fetchApi.logout()

    if(data === 'success'){
      removeToken()
      perMissIoStore.resetState()
      await router.replace('/login')
    }
}

// import { useMainStore } from "@/store/main"
// const mainStore = useMainStore()
// mainStore.$patch({
//   name: '名称被修改了,nameLength也随之改变了'
// })
</script>

<style lang="less" scoped>
.home{
  font-size: 24px;
  .home2{
    color: red;
  }
}
</style>

